import React, {Component} from 'react'
import {Pagination} from 'antd'
import propTypes from 'prop-types'

class Page extends Component {

  state = {
    page: 1
  }

  resetPage = (page = 1) => {
    this.setState({
      page
    })
  }

  render() {
    const {total, page, size, showQuickJumper, showSizeChanger} = this.props
    if (!total) return null
    return (
      <Pagination
        className="pagination"
        current={this.state.page}
        onShowSizeChange={onChange.bind(this)}
        onChange={onChange.bind(this)}
        defaultCurrent={page || 1}
        defaultPageSize={size || 12}
        total={this.props.total}
        pageSizeOptions={['12', '24', '48', '96']}
        showQuickJumper={showQuickJumper}
        showSizeChanger={showSizeChanger} />
    )
  }
}

Page.propTypes = {
  total: propTypes.number,
  page: propTypes.number,
  size: propTypes.number,
  showQuickJumper: propTypes.bool,
  showSizeChanger: propTypes.bool,
  onChange: propTypes.func
}
Page.defaultProps = {
  page: 1,
  size: 12,
  showQuickJumper: true,
  showSizeChanger: true,
  onChange: () => {}
}

function onChange(page, size) {
  this.setState({
    page
  })
  this.props.onChange(page, size)
}

export {Page}
